<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>欢迎使用领捷智慧物流管理系统</title>
    <link rel="hshortcut icon" href="../static/img/own/head.png"/>
    <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i">
    <link rel="stylesheet" href="/static/fonts/fontawesome-all.min.css">
</head>

<body id="page-top">
    <div id="wrapper">
        <div class="d-flex flex-column" id="content-wrapper">
            <div id="content">
            <div class="container-fluid">
            <div class="row" style="border-style: none;">
                <div class="col-md-6 col-xl-3 mb-4" style="border-bottom-width: 0px;border-bottom-style: none;" id="daifahuo">
                </div>
                <div class="col-md-6 col-xl-3 mb-4" id="daishouhuo">
                </div>
                <div class="col-md-6 col-xl-3 mb-4" id="yifahuo">
                </div>
                <div class="col-md-6 col-xl-3 mb-4" id="yujing">
                </div>
            </div>
            <div class="row">
                <div class="col-lg-7 col-xl-8">
                    <div class="card shadow mb-4">
                        <div class="card-header d-flex justify-content-between align-items-center">
                            <h6 class="text-primary font-weight-bold m-0">月销售额趋势图</h6>
                            <div class="dropdown no-arrow"><button class="btn btn-link btn-sm dropdown-toggle" data-toggle="dropdown" aria-expanded="false" type="button"><i class="fas fa-ellipsis-v text-gray-400"></i></button>
                                <div class="dropdown-menu shadow dropdown-menu-right animated--fade-in">
                                    <p class="text-center dropdown-header">dropdown header:</p><a class="dropdown-item" href="#">&nbsp;Action</a><a class="dropdown-item" href="#">&nbsp;Another action</a>
                                    <div class="dropdown-divider"></div><a class="dropdown-item" href="#">&nbsp;Something else here</a></div>
                            </div>
                        </div>
                        <div class="card-body">
                            <div class="chart-area"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div><canvas id="sales" style="display: block; height: 320px; width: 781px;" width="976" height="400" class="chartjs-render-monitor"></canvas></div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-5 col-xl-4">
                    <div class="card shadow mb-4">
                        <div class="card-header d-flex justify-content-between align-items-center">
                            <h6 class="text-primary font-weight-bold m-0">Revenue Sources</h6>
                            <div class="dropdown no-arrow"><button class="btn btn-link btn-sm dropdown-toggle" data-toggle="dropdown" aria-expanded="false" type="button"><i class="fas fa-ellipsis-v text-gray-400"></i></button>
                                <div class="dropdown-menu shadow dropdown-menu-right animated--fade-in">
                                    <p class="text-center dropdown-header">dropdown header:</p><a class="dropdown-item" href="#">&nbsp;Action</a><a class="dropdown-item" href="#">&nbsp;Another action</a>
                                    <div class="dropdown-divider"></div><a class="dropdown-item" href="#">&nbsp;Something else here</a></div>
                            </div>
                        </div>
                        <div class="card-body">
                            <div class="chart-area" >
                                <canvas data-bs-chart="{&quot;type&quot;:&quot;doughnut&quot;,&quot;data&quot;:{&quot;labels&quot;:[&quot;Direct&quot;,&quot;Social&quot;,&quot;Referral&quot;],&quot;datasets&quot;:[{&quot;label&quot;:&quot;&quot;,&quot;backgroundColor&quot;:[&quot;#4e73df&quot;,&quot;#1cc88a&quot;,&quot;#36b9cc&quot;],&quot;borderColor&quot;:[&quot;#ffffff&quot;,&quot;#ffffff&quot;,&quot;#ffffff&quot;],&quot;data&quot;:[&quot;50&quot;,&quot;30&quot;,&quot;15&quot;]}]},&quot;options&quot;:{&quot;maintainAspectRatio&quot;:false,&quot;legend&quot;:{&quot;display&quot;:false},&quot;title&quot;:{}}}"></canvas>
                            </div>
                            <div class="text-center small mt-4"><span class="mr-2"><i class="fas fa-circle text-primary"></i>&nbsp;Direct</span><span class="mr-2"><i class="fas fa-circle text-success"></i>&nbsp;Social</span><span class="mr-2"><i class="fas fa-circle text-info"></i>&nbsp;Refferal</span></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-6 mb-4" id="saleOrder">
<!--                <div class="card shadow mb-4">-->
<!--                    <div class="card-header py-3">-->
<!--                        <h6 class="text-primary font-weight-bold m-0">Projects</h6>-->
<!--                    </div>-->
<!--                    <div class="card-body">-->
<!--                        <h4 class="small font-weight-bold">Server migration<span class="float-right">20%</span></h4>-->
<!--                        <div class="progress mb-4">-->
<!--                            <div class="progress-bar bg-danger" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%;"><span class="sr-only">20%</span></div>-->
<!--                        </div>-->
<!--                        <h4 class="small font-weight-bold">Sales tracking<span class="float-right">40%</span></h4>-->
<!--                        <div class="progress mb-4">-->
<!--                            <div class="progress-bar bg-warning" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%;"><span class="sr-only">40%</span></div>-->
<!--                        </div>-->
<!--                        <h4 class="small font-weight-bold">Customer Database<span class="float-right">60%</span></h4>-->
<!--                        <div class="progress mb-4">-->
<!--                            <div class="progress-bar bg-primary" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"><span class="sr-only">60%</span></div>-->
<!--                        </div>-->
<!--                        <h4 class="small font-weight-bold">Payout Details<span class="float-right">80%</span></h4>-->
<!--                        <div class="progress mb-4">-->
<!--                            <div class="progress-bar bg-info" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%;"><span class="sr-only">80%</span></div>-->
<!--                        </div>-->
<!--                        <h4 class="small font-weight-bold">Account setup<span class="float-right">Complete!</span></h4>-->
<!--                        <div class="progress mb-4">-->
<!--                            <div class="progress-bar bg-success" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%;"><span class="sr-only">100%</span></div>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                </div>-->
<!--                <div class="card shadow mb-4">-->
<!--                    <div class="card-header py-3">-->
<!--                        <h6 class="text-primary font-weight-bold m-0">Todo List</h6>-->
<!--                    </div>-->
<!--                    <ul class="list-group list-group-flush">-->
<!--                        <li class="list-group-item">-->
<!--                            <div class="row align-items-center no-gutters">-->
<!--                                <div class="col mr-2">-->
<!--                                    <h6 class="mb-0"><strong>Lunch meeting</strong></h6><span class="text-xs">10:30 AM</span></div>-->
<!--                                <div class="col-auto">-->
<!--                                    <div class="custom-control custom-checkbox"><input class="custom-control-input" type="checkbox" id="formCheck-1"><label class="custom-control-label" for="formCheck-1"></label></div>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </li>-->
<!--                        <li class="list-group-item">-->
<!--                            <div class="row align-items-center no-gutters">-->
<!--                                <div class="col mr-2">-->
<!--                                    <h6 class="mb-0"><strong>Lunch meeting</strong></h6><span class="text-xs">11:30 AM</span></div>-->
<!--                                <div class="col-auto">-->
<!--                                    <div class="custom-control custom-checkbox"><input class="custom-control-input" type="checkbox" id="formCheck-2"><label class="custom-control-label" for="formCheck-2"></label></div>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </li>-->
<!--                        <li class="list-group-item">-->
<!--                            <div class="row align-items-center no-gutters">-->
<!--                                <div class="col mr-2">-->
<!--                                    <h6 class="mb-0"><strong>Lunch meeting</strong></h6><span class="text-xs">12:30 AM</span></div>-->
<!--                                <div class="col-auto">-->
<!--                                    <div class="custom-control custom-checkbox"><input class="custom-control-input" type="checkbox" id="formCheck-3"><label class="custom-control-label" for="formCheck-3"></label></div>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </li>-->
<!--                    </ul>-->
<!--                </div>-->
            </div>
            <div class="col">
                <div class="row">
                    <div class="col-lg-6 mb-4">
                        <div class="card text-white bg-primary shadow">
                            <div class="card-body">
                                <p class="m-0">Primary</p>
                                <p class="text-white-50 small m-0">#4e73df</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 mb-4">
                        <div class="card text-white bg-success shadow">
                            <div class="card-body">
                                <p class="m-0">Success</p>
                                <p class="text-white-50 small m-0">#1cc88a</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 mb-4">
                        <div class="card text-white bg-info shadow">
                            <div class="card-body">
                                <p class="m-0">Info</p>
                                <p class="text-white-50 small m-0">#36b9cc</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 mb-4">
                        <div class="card text-white bg-warning shadow">
                            <div class="card-body">
                                <p class="m-0">Warning</p>
                                <p class="text-white-50 small m-0">#f6c23e</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 mb-4">
                        <div class="card text-white bg-danger shadow">
                            <div class="card-body">
                                <p class="m-0">Danger</p>
                                <p class="text-white-50 small m-0">#e74a3b</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 mb-4">
                        <div class="card text-white bg-secondary shadow">
                            <div class="card-body">
                                <p class="m-0">Secondary</p>
                                <p class="text-white-50 small m-0">#858796</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    <footer class="bg-white sticky-footer">
        <div class="container my-auto">
            <div class="text-center my-auto copyright"><span>鄂ICP备2021022432号</span></div>
        </div>
    </footer>
    </div><a class="border rounded d-inline scroll-to-top" href="#page-top"><i class="fas fa-angle-up"></i></a></div>
    <script src="/static/js/jquery.min.js"></script>
    <script src="/static/bootstrap/js/bootstrap.min.js"></script>
    <script src="/static/js/chart.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.js"></script>
    <script src="/static/js/script.min.js"></script>
    <script src="/static/js/echarts.js"></script>
    <script src="/static/js/jquery.session.js"></script>



    <script>

        // 预警
        $(document).ready(function (){
            $.ajax({
                url: "/goods/selectGoodsNumLow",
                type: 'post',
                dataType:"JSON",
                success:function (result){
                    if(result>0){
                        var str = "<div class=\"card shadow border-left-primary py-2\" style=\"background-color: #f6c23e\">\n" +
                            "            <div class=\"card-body\">\n" +
                            "                <div class=\"row align-items-center no-gutters\">\n" +
                            "                    <div class=\"col mr-2\">\n" +
                            "                        <div class=\"text-uppercase text-primary font-weight-bold text-xs mb-1\"><span\n" +
                            "                            style=\"font-size: 16px;\">库存预警</span></div>\n" +
                            "                        <div class=\"text-dark font-weight-bold h5 mb-0\"><span\n" +
                            "                            style=\"margin-left: 20px;border-style: none;border-left-width: 0px;border-left-style: solid;\"></span>\n" +
                            "                        </div>\n" +
                            "                    </div>\n" +
                            "                </div>\n" +
                            "            </div>\n" +
                            "        </div>";
                        $("#yujing").append(str);
                    }else{
                        var str = "<div class=\"card shadow border-left-primary py-2\">\n" +
                            "            <div class=\"card-body\">\n" +
                            "                <div class=\"row align-items-center no-gutters\">\n" +
                            "                    <div class=\"col mr-2\">\n" +
                            "                        <div class=\"text-uppercase text-primary font-weight-bold text-xs mb-1\"><span\n" +
                            "                            style=\"font-size: 16px;\">库存正常</span></div>\n" +
                            "                        <div class=\"text-dark font-weight-bold h5 mb-0\"><span\n" +
                            "                            style=\"margin-left: 20px;border-style: none;border-left-width: 0px;border-left-style: solid;\"></span>\n" +
                            "                        </div>\n" +
                            "                    </div>\n" +
                            "                </div>\n" +
                            "            </div>\n" +
                            "        </div>";
                        $("#yujing").append(str);
                    }
                }
            })

        })


        //代发货
        $(document).ready(function (){
            $.ajax({
                url: "/order/selectOutputOrderstate",
                type: "post",
                dataType: "JSON",
                success:function (result){
                    var str = "<div class=\"card shadow border-left-primary py-2\">\n" +
                        "                        <div class=\"card-body\">\n" +
                        "                            <div class=\"row align-items-center no-gutters\">\n" +
                        "                                <div class=\"col mr-2\">\n" +
                        "                                    <div class=\"text-uppercase text-primary font-weight-bold text-xs mb-1\"><span style=\"font-size: 16px;\">待出库</span></div>\n" +
                        "                                    <div class=\"text-dark font-weight-bold h5 mb-0\"><span style=\"margin-left: 20px;border-style: none;border-left-width: 0px;border-left-style: solid;\">"+result+"</span></div>\n" +
                        "                                </div>\n" +
                        "                            </div>\n" +
                        "                        </div>\n" +
                        "                    </div>"
                $("#daifahuo").append(str);
                }
            })
        })

        //待入库
        $(document).ready(function (){
            $.ajax({
                url: "/inputorder/selectInputOrderstate",
                type: "post",
                dataType: "JSON",
                success:function (result){
                    var str = "<div class=\"card shadow border-left-primary py-2\">\n" +
                        "                        <div class=\"card-body\">\n" +
                        "                            <div class=\"row align-items-center no-gutters\">\n" +
                        "                                <div class=\"col mr-2\">\n" +
                        "                                    <div class=\"text-uppercase text-primary font-weight-bold text-xs mb-1\"><span style=\"font-size: 16px;\">待入库</span></div>\n" +
                        "                                    <div class=\"text-dark font-weight-bold h5 mb-0\"><span style=\"margin-left: 20px;border-style: none;border-left-width: 0px;border-left-style: solid;\">"+result+"</span></div>\n" +
                        "                                </div>\n" +
                        "                            </div>\n" +
                        "                        </div>\n" +
                        "                    </div>"
                $("#daishouhuo").append(str);
                }
            })
        })

        //已发货
        $(document).ready(function (){
            $.ajax({
                url: "/order/selectOutputOrderstate2",
                type: "post",
                dataType: "JSON",
                success:function (result){
                    var str = "<div class=\"card shadow border-left-primary py-2\">\n" +
                        "                        <div class=\"card-body\">\n" +
                        "                            <div class=\"row align-items-center no-gutters\">\n" +
                        "                                <div class=\"col mr-2\">\n" +
                        "                                    <div class=\"text-uppercase text-primary font-weight-bold text-xs mb-1\"><span style=\"font-size: 16px;\">已发货</span></div>\n" +
                        "                                    <div class=\"text-dark font-weight-bold h5 mb-0\"><span style=\"margin-left: 20px;border-style: none;border-left-width: 0px;border-left-style: solid;\">"+result+"</span></div>\n" +
                        "                                </div>\n" +
                        "                            </div>\n" +
                        "                        </div>\n" +
                        "                    </div>"
                $("#yifahuo").append(str);
                }
            })
        })


    </script>

    <script>

        //销售排名图
        $(document).ready(function (){
            $.ajax({
                url:"/order/selectSaleOrder",
                type:"post",
                dataType:"JSON",
                success:function (result){
                    var str = "";

                    str = "<div class=\"card shadow mb-4\">\n" +
                        "                    <div class=\"card-header py-3\">\n" +
                        "                        <h6 class=\"text-primary font-weight-bold m-0\">销售排名</h6>\n" +
                        "                    </div>\n" +
                        "                    <div class=\"card-body\">\n" +
                        "                        <h4 class=\"small font-weight-bold\">"+"商品"+result[0]+"<span class=\"float-right\">"+result[1]+"</span></h4>\n" +
                        "                        <div class=\"progress mb-4\">\n" +
                        "                            <div class=\"progress-bar bg-danger\" aria-valuenow=\"20\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: "+result[10]+"%;\"><span class=\"sr-only\">"+result[1]+"</span></div>\n" +
                        "                        </div>\n" +
                        "                        <h4 class=\"small font-weight-bold\">"+"商品"+result[2]+"<span class=\"float-right\">"+result[3]+"</span></h4>\n" +
                        "                        <div class=\"progress mb-4\">\n" +
                        "                            <div class=\"progress-bar bg-warning\" aria-valuenow=\"40\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: "+result[11]+"%;\"><span class=\"sr-only\">"+result[3]+"</span></div>\n" +
                        "                        </div>\n" +
                        "                        <h4 class=\"small font-weight-bold\">"+"商品"+result[4]+"<span class=\"float-right\">"+result[5]+"</span></h4>\n" +
                        "                        <div class=\"progress mb-4\">\n" +
                        "                            <div class=\"progress-bar bg-primary\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: "+result[12]+"%;\"><span class=\"sr-only\">"+result[5]+"</span></div>\n" +
                        "                        </div>\n" +
                        "                        <h4 class=\"small font-weight-bold\">"+"商品"+result[6]+"<span class=\"float-right\">"+result[7]+"</span></h4>\n" +
                        "                        <div class=\"progress mb-4\">\n" +
                        "                            <div class=\"progress-bar bg-info\" aria-valuenow=\"80\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: "+result[13]+"%;\"><span class=\"sr-only\">"+result[7]+"</span></div>\n" +
                        "                        </div>\n" +
                        "                        <h4 class=\"small font-weight-bold\">"+"商品"+result[8]+"<span class=\"float-right\">"+result[9]+"</span></h4>\n" +
                        "                        <div class=\"progress mb-4\">\n" +
                        "                            <div class=\"progress-bar bg-success\" aria-valuenow=\"100\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: "+result[14]+"%;\"><span class=\"sr-only\">"+result[9]+"</span></div>\n" +
                        "                        </div>\n" +
                        "                    </div>\n" +
                        "                </div>"

                    $("#saleOrder").append(str);
                }
            })
        })


        //月销售额图表
        $(document).ready(function (){
            var da = [];
            var nums = [];
            $.ajax({
                url: "/order/moneyEveryMonth",
                type: "post",
                dataType: "JSON",
                success: function (result) {

                    for(var i = result.length-1;i>=0;i--){
                        da.push(result[i].month);
                    }
                    for(var i = result.length-1;i>=0;i--) {
                        nums.push(result[i].money);
                    }

                    var ctx = document.getElementById("sales");
                    var myChart = new Chart(ctx, {
                        type:"line",
                        data:{
                            labels:da,
                            datasets:[{
                                label:"销售额",
                                fill:true,
                                data:nums,
                                backgroundColor:"rgba(78, 115, 223, 0.05)",
                                borderColor:"rgba(78, 115, 223, 1)"
                            }]
                        },
                        options:{
                            maintainAspectRatio:false,
                            legend:{display:false},
                            title:{},
                            scales:{
                                xAxes:[{
                                    gridLines:{
                                        color:"rgb(234, 236, 244)",
                                        zeroLineColor:"rgb(234, 236, 244)",
                                        drawBorder:false,
                                        drawTicks:false,
                                        borderDash:[2],
                                        zeroLineBorderDash:[2],
                                        drawOnChartArea:false
                                    },
                                    ticks:{
                                        fontColor:"#858796",
                                        padding:20
                                    }
                                }],
                                yAxes:[{
                                    gridLines:{
                                        color:"rgb(234, 236, 244)",
                                        zeroLineColor:"rgb(234, 236, 244)",
                                        drawBorder:false,
                                        drawTicks:false,
                                        borderDash:[2],
                                        zeroLineBorderDash:[2]},
                                    ticks:{
                                        fontColor:"#858796",padding:20
                                    }
                                }]
                            }
                        }
                    });
                }
            })
        })

        //session
        $.session.set("url",window.location.href);
    </script>
</body>

</html>